IMAGE_PARAM_KNOB

Description

Active element that displays an image depending on the value of the parameter. Its is as an animation or 'filmstrip' for which the image is chosen depending on the value of the parameter: if the parameter value is equal to its minimum the first image is displayed. If the parameter value is equal to its maximum, the last image is displayed. The control supports several keyboard shortcuts and mouse dragging. For more information, see Param Control widgets user experience.

Common Attributes

See the attributes common to all param control widgets.

Specific Attributes
Name Value Type Default Value Description Comment V.
Images

image

valid image file path

empty

Image file containing the list of images to display.

It is a single image containing a 'film strip' with many images. It can be vertical or horizontal, see the image_orientation attribute.

1.0

image_mask

valid image file path

'image' value with '_mask' postfix

Path to the alpha mask for previous image.

This value is optional since by default it is generated from 'image'.

1.0

image_disabled

valid image file path

'image' value with '_disabled' postfix

Image file containing the list of images to display when the control is disabled

This value is optional since by default it is generated from 'image'.

1.0

image_disabled_mask

valid image file path

'image_disabled' value with '_mask' postfix

Path to alpha mask for previous image

This value is optional since by default it is generated from 'image'.

1.0

image_hover

valid image file path

'image' value with '_hover' postfix

Image file containing the list of images to display when the mouse is over

This value is optional since by default it is generated from 'image'.

1.0

image_hover_mask

valid image file path

'image_hover' value with '_mask' postfix

Path to alpha mask for previous image

This value is optional since by default it is generated from 'image'.

1.0

image_focus

valid image file path

'image' value with '_focus' postfix

Image file containing the list of images to display when the control has focus

This value is optional since by default it is generated from 'image'.

1.0

image_focus_mask

valid image file path

'image_focus' value with '_mask' postfix

Path to alpha mask for previous image

This value is optional since by default it is generated from 'image'.

1.0

image_pushed

valid image file path

'image' value with '_focus' postfix

Image file containing the list of images to display when the mouse is down over the control

This value is optional since by default it is generated from 'image'.

1.0

image_pushed_mask

valid image file path

'image_focus' value with '_mask' postfix

Path to alpha mask for previous image

This value is optional since by default it is generated from 'image'.

1.0

Other settings

images_count

Positive integer

0

Number of images in the film strips contained in the image files

All image files must contain the same number of images

1.0

image_orientation

orientation

vertical

Orientation of the image file containing the film strip images


1.0

orientation

orientation

vertical

Orientation of the mouse control for the knob.

If set to horizontal, the value of the parameter value will vary according to horizontal mouse movements.

1.0

pixel_range

Positive integer

40

Range of the mouse movements to change the parameter value.

Use a larger value to improve precision of the mouse and smaller values to reduce the mouse movements necessary to change the parameter value.

1.0

Examples
<?xml version="1.0" encoding="utf-8" ?>
<SKIN language_version="1.0" background_image="bg.bmp" repeat="true" h_margin="10" v_margin="10">
	<IMAGE_PARAM_KNOB param_id="dsp.input1" image="knob_black.bmp" images_count="127" image_orientation="horizontal" />
</SKIN>

The folder contains:

(extract. The file contains 127 images)

knob_black.bmp: 127 positions of the control

(extract. The file contains 127 images)

knob_black_mask.bmp:alpha mask for the 127 positions of the control

The result is:

(the pictures show the widget for different values of the parameter)

0%

50%

100%

<?xml version="1.0" encoding="utf-8" ?>
<SKIN language_version="1.0" background_image="bg.bmp" repeat="true" h_margin="10" v_margin="10">
	<IMAGE_PARAM_KNOB param_id="dsp.input1" image="knob_black.bmp" images_count="127" image_orientation="horizontal"
		response_curve="exp1" />
</SKIN>


0%

50%

100%

Note that the position range for 0 to 50% is larger than the positions range from 50% to 100% : the conversion curve is an exponential function. You thus have more precision for the low values of the parameter.

<?xml version="1.0" encoding="utf-8" ?>
<SKIN language_version="1.0" background_image="bg.bmp" repeat="true" h_margin="10" v_margin="10">
	<IMAGE_PARAM_KNOB param_id="dsp.input1" image="knob_black.bmp" images_count="127" image_orientation="horizontal"
		response_curve="log1" />
</SKIN>


0%

50%

100%

Normal state

Mouse over, focus and pushed states

Note: in this case all knob images share the same mask file: knob_black_mask.bmp. There is no need to add a mask file for all images. See the about images section for more details.